<template>
    <div id="enters">
      <div class="registerContent">
        <div class="l_header_bg"></div>
        <div class="l_cont">
          <div class="shortcut">
            <div class="shortcut_view">
              <div class="shortcut_title">
                <div class="shortcut_title_text">快捷入口设置</div>
                <div class="shortcut_line"><span></span></div>
              </div>
              <div class="shortcut_cont">
                <div class="shortcut_left">
                  <div class="shortcut_left_view">
                    <div class="shortcut_left_title">可选菜单</div>
                    <div class="shortcut_left_line"></div>
                    <div class="shortcut_left_cont">
                      <div class="shortcut_left_cont">
                        <div
                          class="shortcut_left_li"
                          v-for="(item,index) in list"
                          :key="index">
                          <em>{{item.sCustomerResourceEntity.resourceName}}</em>
                          <div
                            v-if="item.sCustomerResourceEntityList.length != 0"
                            class="Bnames">
                            <span
                              v-for="(items,indexs) in item.sCustomerResourceEntityList"
                              :key="indexs"
                              :class="items.isChoose == 1? 'gray':''"
                              :isChoose="items.isChoose"
                              @click="AddEnter(items,index,indexs)"
                              >{{ items.resourceName }}</span>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="shortcut_right">
                  <div class="shortcut_right_view">
                    <div class="shortcut_right_title">
                      已选菜单<span style="font-size: 12px"
                        >(最多选择6个！)</span>
                    </div>
                    <div class="shortcut_right_line"></div>
                    <div class="shortcut_right_cont">
                      <div class="shortcut_cont_title">可拖动控件调整位置</div>
                      <div id="filter" style="margin-left: 30px">
                        <div
                          style="margin-left: -10px"
                          class="block__list block__list_words">
                          <ul id="editable" v-if="editable_li.length != 0">
                            <li
                              v-for="(item,index) in editable_li"
                              :key="index">
                              {{ item.resourceName }} <i class="js-remove" @click="DelEnter(item,index)">✖</i>
                            </li>
                          </ul>
                          <ul id="editable" v-else>
                            <li>请添加</li>
                          </ul>
                        </div>
                      </div>
                    </div>
                    <div class="shortcut_cont_btn">
                      <span class="shortcut_btn_remove">取 消</span>
                      <span class="shortcut_btn_sz" @click="KeepSet">保存设置</span>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
</template>
<script>
export default {
  props: [],
  data() {
    return {
      list: [],
      show: false,
      show1: false,
      show2: false,
      editable_li: []
    };
  },
  mounted() {
    // console.log("tag", this.$store.state.comm.ENTER);
    this.getAllList();
    this.getUserList();
  },
  methods: {
    //获取user所有菜单
    getAllList() {
      let data = [
        {
          sCustomerResourceEntity: {
            id: 2,
            level: 1,
            orderNum: 1,
            resourceName: "首页",
            resourcePath: "/home/home"
          },
          sCustomerResourceEntityList: []
        },
        {
          sCustomerResourceEntity: {
            id: 3,
            level: 1,
            orderNum: 2,
            resourceName: "版权内容仓库",
            resourcePath: "/warehouse/detailsjoin"
          },
          sCustomerResourceEntityList: [
            {
              id: 6,
              isChoose: 0,
              level: 2,
              orderNum: 1,
              resourceName: "内容自动接入",
              resourcePath: "/warehouse/detailsjoin"
            },
            {
              id: 7,
              isChoose: 1,
              level: 2,
              orderNum: 2,
              resourceName: "版权内容仓库",
              resourcePath: "/warehouse/warehouse"
            },
            {
              id: 9,
              isChoose: 0,
              level: 2,
              orderNum: 4,
              resourceName: "著作权证书管理",
              resourcePath: "/CopyrightContent/zhengshuGl"
            },
            {
              id: 10,
              isChoose: 1,
              level: 2,
              orderNum: 5,
              resourceName: "著作权代办管理",
              resourcePath: "/agency/agency"
            }
          ]
        },
        {
          sCustomerResourceEntity: {
            id: 4,
            level: 1,
            orderNum: 3,
            resourceName: "版权咨询服务",
            resourcePath: "/law/law"
          },
          sCustomerResourceEntityList: [
            {
              id: 11,
              isChoose: 1,
              level: 2,
              orderNum: 1,
              resourceName: "专业法务咨询",
              resourcePath: "/law/law"
            }
          ]
        },
        {
          sCustomerResourceEntity: {
            id: 5,
            level: 1,
            orderNum: 4,
            resourceName: "账户管理",
            resourcePath: "/account/subject"
          },
          sCustomerResourceEntityList: [
            {
              id: 12,
              isChoose: 0,
              level: 2,
              orderNum: 1,
              resourceName: "主体信息",
              resourcePath: "/account/subject"
            },
            {
              id: 13,
              isChoose: 1,
              level: 2,
              orderNum: 2,
              resourceName: "消费管理",
              resourcePath: "/account/consumption"
            },
            {
              id: 14,
              isChoose: 1,
              level: 2,
              orderNum: 3,
              resourceName: "用户管理",
              resourcePath: "/usergl/usergl"
            }
          ]
        }
      ];
      this.list = data;
    },
    getUserList() {
      let data = [
        // {
        //   id: 259,
        //   parentId: 3,
        //   resourceId: 7,
        //   resourceName: "版权内容仓库",
        //   resourcePath: "/warehouse/warehouse",
        //   sort: 1,
        //   userId: 139
        // },
        // {
        //   id: 260,
        //   parentId: 3,
        //   resourceId: 10,
        //   resourceName: "著作权代办管理",
        //   resourcePath: "/agency/agency",
        //   sort: 2,
        //   userId: 139
        // },
        // {
        //   id: 261,
        //   parentId: 4,
        //   resourceId: 11,
        //   resourceName: "专业法务咨询",
        //   resourcePath: "/law/law",
        //   sort: 3,
        //   userId: 139
        // },
        // {
        //   id: 262,
        //   parentId: 5,
        //   resourceId: 13,
        //   resourceName: "消费管理",
        //   resourcePath: "/account/consumption",
        //   sort: 4,
        //   userId: 139
        // },
        // {
        //   id: 263,
        //   parentId: 5,
        //   resourceId: 14,
        //   resourceName: "用户管理",
        //   resourcePath: "/usergl/usergl",
        //   sort: 5,
        //   userId: 139
        // }
      ];
      this.editable_li = data;
    },
    AddEnter(item, index, indexs) {
      if (this.list[index].sCustomerResourceEntityList[indexs].isChoose == 0) {
        this.list[index].sCustomerResourceEntityList[indexs].isChoose = 1;
        for (let i = 0; i < this.editable_li.length; i++) {
          if (this.editable_li[i].resourceName == item.resourceName) {
            this.editable_li.splice(i, 1);
          }
        }
      } else {
        this.list[index].sCustomerResourceEntityList[indexs].isChoose = 0;

        this.editable_li.push(item);
        // console.log(item);
      }
    },
    KeepSet() {
      if (this.editable_li.length < 1) {
        this.$Mess.Error({
          title: "提示",
          content: "少于6个",
          // isShowInput: true
        });
      }
      let Setdata = [];
      for (let i = 0; i < this.editable_li.length; i++) {
        let obj = {
          resourceId: this.editable_li[i].id,
          sort: i + 1
        };
        Setdata.push(obj);
      }
      console.log(Setdata); //完美
    },
    DelEnter(item, index) {
      for (let i = 0; i < this.list.length; i++) {
        for (
          let j = 0;
          j < this.list[i].sCustomerResourceEntityList.length;
          j++
        ) {
          console.log(this.list[i].sCustomerResourceEntityList[j]);
          if (
            item.resourceName ==
            this.list[i].sCustomerResourceEntityList[j].resourceName
          ) {
            this.list[i].sCustomerResourceEntityList[j].isChoose = 1;
            this.editable_li.splice(index, 1);
          }
        }
      }
    }
  }
};
</script>
<style scoped>
@import "../home.css";
</style>

